<template>
  <a-modal
    :maskClosable="maskClosable"
    title="业务特点设置"
    :width="600"
    :visible="visible"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-spin :spinning="confirmLoading">
      <a-form :form="form" :labelCol="labelCol" :wrapperCol="wrapperCol">
        <a-form-item label="业务特点推荐">
          {{ typeCnMap[model.featureSuggest] || "其它" }}
        </a-form-item>
        <a-form-item label="业务特点选择">
          <a-radio-group v-model="model.featureChoose">
            <a-radio value="CPU">计算密集型</a-radio>
            <a-radio value="IO">磁盘IO密集型</a-radio>
            <a-radio value="AI">人工智能型</a-radio>
            <!-- <a-radio value="UNKNOWN">其它</a-radio> -->
          </a-radio-group>
        </a-form-item>
      </a-form>
    </a-spin>
  </a-modal>
</template>
<script>
import { gPostAction } from '@/api/manage'
export default {
  name: 'UpdateModal',
  data() {
    return {
      visible: false,
      confirmLoading: false,
      form: this.$form.createForm(this),
      model: {},
      dataCenterList: [],
      threshold: [],
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 19 },
      },
      typeCnMap: {
        CPU: '计算密集型',
        IO: '磁盘IO密集型',
        AI: '人工智能型',
        // UNKNOWN: '其它',
      },
      maskClosable: false,
    }
  },
  methods: {
    update(record) {
      this.model = Object.assign({}, record)
      this.model.featureChoose = this.model.featureChoose || this.model.featureSuggest
      this.visible = true
    },
    handleOk(e) {
      this.confirmLoading = true
      const postData = {
        appId: this.model.appId,
        featureChoose: this.model.featureChoose
      }
      gPostAction('/profile/updateFeatureChoose', postData)
        .then((res) => {
          if (res.success) {
            this.$message.success('操作成功')
            this.$emit('ok')
          }
        })
        .finally(() => {
          this.confirmLoading = false
          this.handleCancel()
        })
    },
    handleCancel(e) {
      this.visible = false
    },
  },
}
</script>

<style lang="less" scoped>
.ant-radio-wrapper {
  margin-right: 38px;
}
</style>
